import Vue from "vue";
import pageing from "../../../components/pageing/pageing.js";
import {request} from "../../../util/request.js";
import "../../../style/basic.less";
import "./list.less";
import mediaView from "../../../components/mediaView/mediaView";
new Vue({
    el:"#louie",
    data:{
        navs:[
            {name:"普通红包",value:"normal",icon:"iconfont icon-hongbao"},
            {name:"图片红包",value:"pic",icon:"iconfont icon-Image"},
            {name:"视频红包",value:"video",icon:"iconfont icon-Image"}
        ],
        nav_index:0,
        returnNum:10,  //请求数据数量
        pageNum:1,  //当前page页面
        total:0,
        list:[],   //列表
        media_view:{   //素材查看器数据
            show:false,
            media:""
        }
    },
    components:{
        page:pageing,
        "media-view":mediaView
    },
    created:function(){
        this.getTotal()
            .then(()=>{
                if(this.total > 0){
                    this.getList();
                }
            });
    },
    methods:{
        /**
         * 切换导航
         */
        changeNav:function(index){
            if(this.nav_index !== index){
                this.nav_index = index;
                this.list = [];
                this.pageNum = 1;
                this.getTotal()
                    .then(()=>{
                        if(this.total > 0){
                            this.getList();
                        }
                    });
            }
        },
        /**
         * 获取列表数据总数
         */
        getTotal(){
            return new Promise((success)=>{
                request('redDetail/getTotal',{
                    red_type:this.navs[this.nav_index].value
                })
                    .then((res)=>{
                        if(res.data.status === "success"){
                            this.total = parseInt(res.data.data);
                            success();
                        }
                    });
            });
        },
        /**
         * 获取列表
         */
        getList(){
            request("redDetail/getWebList",{
                red_type:this.navs[this.nav_index].value,
                limit:[(this.pageNum-1)*this.returnNum,this.returnNum]
            })
                .then((res)=>{
                    if(res.data.status === "success"){
                        this.list = res.data.data;
                    }
                });
        },
        /**
         * 点击分页
         * @param page
         */
        changePage:function(page){
            this.pageNum = page;
            this.getList();
        },
        /**
         * 点击视频封面播放视频
         * @param thumb 封面地址
         */
        playerVideo(video){
            this.media_view.show = true;
            this.media_view.media = video;
        }
    }
});